<html>

<style>
table {
  border-collapse: collapse;
  border-spacing: none;
  }

thead th {
  background-color: #F7BE81;
  font-size: 12px;
  font-family: sans-serif;
  border:none;
  }

tbody td {
  font-size: 12px;
}


tr td:first-child,
tr th:first-child {
      border-top-left-radius: 6px;
	  border-bottom-left-radius: 6px;
}

tr td:last-child,
tr th:last-child {
  border-top-right-radius: 6px;
  border-bottom-right-radius: 6px;
}
</style>
<div >
<h3>UnApproved Transactions List</h3>
<!-- <form  novalidate name="UpdatetranForm" id="update-tran-form" method="post" action="">
  
   <input type="text" ng-model="name" class="search-query" placeholder="Search"> 
      <!--<button href="#/updttrandata/{{checkboxes.items}}"ng-click="updttrandata({{checkboxes.items}})" class="btn btn-success">Approve</button> 
      <a class="btn btn-success pull-right" href="#/updttrandata/{{checkboxes.items}}" ng-click="updttrandata({{checkboxes.items}})">Approve</a>-->
    <!--</br> -->
	
	<table>
	<tr>
		<td>Date : </td>
		 <td><input type="date" ng-model="updtran.tran_Date" required> </td>
		<td>Client Name :</td>
		<!--<td><input type="text" name="clientname" ng-model="updtran.Dist_Name" capitalize></td> -->
		 <td><select ng-model="clist" ng-options="cust.Name+' ('+cust.custtype+')' for cust in customermast " ></select> </td>
		<td>Business :</td><td><input type="text" name="Business" ng-model="updtran.Business"></td>
	</tr>
	
	<tr>
		<td>Net Rate : </td><td><input type="text" name="Net_Rate" ng-model="updtran.Net_Rate"> </td>
		<td>Debit : </td><td><input type="text" name="Dr_Amount" ng-model="updtran.Dr_Amount"></td>
		<td>Credit : </td><td><input type="text" name="Cr_Amount" ng-model="updtran.Cr_Amount"></td>
	</tr>
	
	<tr>
		<td>Bank : </td><td><input type="text" name="Bank" ng-model="updtran.Bank"> </td>
		<td>Branch :</td><td><input type="text" name="Branch" ng-model="updtran.Branch"></td>
		<td>Remarks :</td><td><input type="text" name="remarks" ng-model="updtran.remarks"></td>
	</tr>
	
    </table> 
    <tt>Total Records Pending to be Approved ={{transactionmast.length}}</tt>

   <!-- <tt>counter = {{counter}}</tt><br/> -->
      <!--<tt> <strong>Value:</strong> {{checkboxes.items[tran.Dist_Name]}}</tt> -->
  <!-- {{checkboxes.items}} 
   
   <tt> {{tr1}}</tt> 
 
<form>
<input type="checkbox" id = "tr1" name="tr" value="1">1<br>
<input type="checkbox" id = "tr2" name="tr" value="2">2<br>
<br>
<input type="button" onclick="myFunction()" value="Approve All">
<!--<input type="button" value="Approve transactions" ng-click="approv(tran.Referenceno)">
<br><br>
<input type="text" id="order" size="50">

</form>

<script>
function myFunction(tr) {
    var tr = document.forms[0].tr;
    var txt = "";
    var i;
    for (i = 0; i < tr.length; i++) {
        if (tr[i].checked) {
            txt = txt + tr[i].value + " ";
        }
    }
    document.getElementById("order").value = "Tran id: " + txt;
}
</script>-->

 <!--
 <div ng-repeat="tran in transactionmast">
	<!--<div class="action-checkbox"> -->
	<!--<input id="{{tran.Referenceno}}" type="checkbox" value="{{tran.Referenceno}}" ng-checked="selection.indexOf(tran.Referenceno) > -1" ng-click="toggleSelection(tran.Referenceno)" />
	<!--<label for="{{tran.Referenceno}}"></label> 
			{{tran.Referenceno}}
  <!--</div> 
 </div> -->
 <table>
  
	<span style="color:brown;" class="selected-item">Selected Items:<span>
	<span ng-repeat="Referenceno in selection" class="selected-item">  {{Referenceno}},</span>		
	<!--gyani change -- please update the code to pass tranid comma seperated. -->
	<!-- <input type="button" ng-click="ApproveTrans{{Referenceno}}" value="Approve All">  -->
	<input type="button" ng-click="ApproveTrans()" value="Approve All"> 
	<!--<input type="button" onclick="myalert({{tranName}})" value="Approve All">-->
	<!-- <script >
		function myalert(tranName)
		{
		var i=0
			alert("hello2"+tranName);
			var obj = { 0: "A", 1: "B", length: 2 }
			alert( [].join.call(obj) ) 
			
			
			var url=document.getElementById("Referenceno").value;
					
					// Opens the url in the same window
					//   window.open(url, "_self");
					alert(url);
		}
		function myFunction() 
				{
				alert(+Referenceno)    
				document.getElementById("order").value = "Tran id: " + txt;
				
								// the url which you have to reload is this page, but you add an action to the GET- or POST-variable
					var url="<?php echo $_SERVER[PHP_SELF];?>"+document.getElementById("order").value;
					
					// Opens the url in the same window
					//   window.open(url, "_self");
					alert(url);
				}
 </script> -->
				
			 
 </table>
  <table class="table table-striped table-condensed table-hover">
      <thead>
      <tr>
      <th><input type="checkbox" ng-click="alltranClicked()" ng-checked="alltranMet()"></th>
      <th>Ref #</th>
      <th>Date</th>
      <th><a href="" ng-click="predicate = 'Dist_Name'; reverse=!reverse">Client Name</a></th>
      <th>Business</th>
      <th>Net Rate</th>
      <th>Debit</th>
      <th>Credit</th>
      <th>Bank</th>
      <th>Branch</th>
      <th>Pay Mode</th>
      <th>Pay Date</th>
      <th>Remarks</th>
      <th><a href="" ng-click="predicate = 'enteredby'; reverse=!reverse">Entered By</a></th>
    <!--   <th>Status</th>-->
     <th>Action</th> 
    </tr>
  </thead>

<tbody>
	<tr ng-repeat="tran in transactionmast | filter: name | orderBy:predicate:reverse | startFrom:currentPage*pageSize | limitTo:pageSize">
      <!--<td><input type="checkbox" ng-model="checkboxes.items[tran.Dist_Name]" ng-checked="updttrandata(tran)"ng-click="updttrandata(tran)" ng-change="change()" > </td>  
      <td><input type="checkbox" id="customValCheck"  ng-model="checkboxes.items[tran.Referenceno]"  ng-change="change({{tran}})"> </td>  -->
	  <td><input id="{{tran.Referenceno}}" type="checkbox" value="{{tran.Referenceno}}" ng-checked="selection.indexOf(tran.Referenceno) > -1" ng-click="toggleSelection(tran.Referenceno)" /> </td>
      <td>{{tran.Referenceno}}</td>
      <td>{{tran.tran_Date}}</td>
      <td>{{tran.Dist_Name}}</td>
      <td>{{tran.Business}}</td>
      <td>{{tran.Net_Rate}}</td>
      <td>{{tran.Dr_Amount}}</td>
      <td>{{tran.Cr_Amount}}</td>
      <td>{{tran.Bank}}</td>
      <td>{{tran.Branch}}</td>
      <td>{{tran.payid}}</td>
      <td>{{tran.paydate}}</td>
      <td>{{tran.remarks}}</td>
      <td>{{tran.enteredby}}</td>
    <!--    <td>{{tran.status}}</td>-->
      <td><a href="#/edittran/" ng-click="edit(tran.Referenceno)"> <img src="glyphicons_edit.png" alt="Edit"/></td> 
      
     </tr>
    </tbody>
 </table>
     	{{tran.Referenceno}}
   <tfoot>
        Current Page    {{currentPage+1}} of {{transactionmast.length/pageSize}}
      <td colspan="6">
         <div class="pagination pull-right">
           <ul>
          <!--  <li ng-class="{disabled: currentPage == 0}">
                <a href ng-click="currentPage=currentPage-1">« Prev</a> 
         </li>-->
          <button class="btn btn-info" ng-disabled="currentPage == 0" ng-click="currentPage=currentPage-1"> « Prev </button>
                    
           <li ng-repeat="n in range(transactionmast.length)"
               ng-class="{active: n == currentPage}"
               ng-click="setPage()">
                <a href ng-bind="n + 1">1</a>
           </li> 
           <!--    <li ng-class="{disabled: currentPage >= customermast.length/pageSize - 1 }">
                     <a href ng-click="currentPage=currentPage+1">Next »</a>  -->
    <button class="btn btn-info" ng-disabled="currentPage >= transactionmast.length/pageSize - 1" ng-click="currentPage=currentPage+1"> Next » </button>
   </li>
    </ul>
   </div>
   </td>
   </tfoot>
   </div>
</body>
</html>
